<template>
	<view>
		<view class="commentItem" v-for="(item, index) in list" :key="index">
			<view class="header flex flexBeb">
				<view class="info flex">
					<image :src="item.hesd_portrait" mode=""></image>
					<view class="textHd name">
					<text>{{item.name}}</text>
					<view class="textHd score">评分:{{item.s_score || item.shop_score}}</view>
					</view>
				</view>
				<view class="time">
					{{item.releasetime.slice(0,10)}}
				</view>
			</view>
			<view class="commentContent textHd2">
				{{item.content | emojoy}}
			</view>
			<view class="imageList flex ">
				<image :src="img" v-for="(img, index) in item.picture.split(';')" :key="index"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import {getimg} from '../utils/lib.js'
	export default {
		name:"foods_comments",
		props: {
			list: {
			type: Array,
			required: true,
			default() {
				return []
			}
			}
		},
		mounted() {
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss" scoped>
.commentItem {
	padding: 18rpx 0;
	&:first-child {
		margin-top: 0;
		border-radius:0  24rpx;
	}
	margin-top: 32rpx;
	border-radius: 24rpx;
	border-bottom: 2rpx solid #fafafa;
	.header {
		justify-content: space-between;
		.info {
			width: 240rpx;
			.name {
				width: 120rpx;
				margin-left: 28rpx;
			}
			.score {
				color: #999;
				font-size: 24rpx;
			}
			image {
				width: 80rpx;
				height: 80rpx;
				border-radius: 12rpx;
			}
		}
		.time {
			color: #999;
			font-size: 20rpx;
		}
	}
	.commentContent {
		font-size: 22rpx;
	}
	.imageList {
		margin-top: 18rpx;
		image {
			width: 230rpx;
			height: 180rpx;
			margin-right: 18rpx;
		}
	}
}
</style>
